<template>
  <div class="body1" style="padding-top:10px;">

    <div class="form_select">
      <div>
          <el-input class="select_input1" size="small" v-model="form.username" 
          placeholder="客户姓名"></el-input>
          <el-input class="select_input1" size="small" v-model="form.phone" 
          placeholder="客户电话"></el-input>
          <el-select class="select_option1" size="small" v-model="form.lv" placeholder="客户等级">
            <el-option
              v-for="item in cate"
              :key="item.name"
              :label="item.name"
              :value="item.lv">
            </el-option>
          </el-select>
          <el-button type="primary"  size="small" @click="getList">
          &nbsp;&nbsp;搜&nbsp;&nbsp;索&nbsp;&nbsp;
          </el-button>
      </div>
      <div class="select_right">
          <el-button type="primary"  size="small" @click="exportExcel">导出excel</el-button>
          <el-button type="primary"  size="small" @click="dialogShow('addShow')">新增客户</el-button>
      </div>
    </div>
    <userTable :list="list" @func="dialogClose"></userTable>
    <userAdd :show="addShow" :userArr="userArr" @func="dialogClose"></userAdd>
    <userEdit :show="editShow" :userArr="userArr" :item="item" @func="dialogClose"></userEdit>
    <!--<userCate :show="cateShow" :cate="cateArr" @func="change"></userCate>-->
    </div>
   </div>


</template>
 
<script>
import userAdd from "./add"
import userEdit from "./edit"
import userTable from "./table"
//import userCate from "./cate"
import {excelExport} from "../../public/excelExport"
export default {
  name: "User",
  data() {
    return {
      list:[],
      form:{
        lv:''
      },
      cate:[
        {id:0,name:'全部',lv:''},
        {id:1,name:'A类会员',lv:'A'},
        {id:2,name:'B类会员',lv:'B'},
        {id:3,name:'C类会员',lv:'C'},
        {id:4,name:'D类会员',lv:'D'}
      ],
      addShow:false,
      editShow:false,
      userArr:[
        {id:0,realname:'无',uid:0}
      ],
      item:{}
    };
  },
  components: {
    "userAdd": userAdd,
    "userEdit": userEdit,
    "userTable": userTable,
    //"userCate":userCate
  },
  created: function() {
    this.getList()
  },
  methods: {
    getList:function() {
      this.form.oa_id = localStorage.getItem('oa_id')
      var that = this
      this.$get('pc/user/all',this.form).then((res) => {
        that.list = res.data
      })
    },
    dialogClose:function(data){
      this[data.key] = !this[data.key]
      if(data.item){
        this.item = data.item
        if(this.userArr.length == 1){
          this.getUser()
        }
      }
      if(data.type){
        this.getList()
      }

    },
    dialogShow:function(key){
      if(this.userArr.length == 1){
        this.getUser()
      }
      this[key] = true
    },
    getUser:function(){
      var data = {oa_id:localStorage.getItem('oa_id')}
      var that = this
      this.$get('pc/staff/all',data).then((res) => {
          var userArr = that.userArr
          that.userArr = userArr.concat(res.data)
      })
    },
    exportExcel:function() {
      var url = this.apiUrl + 'pc/user/export?oa_id='+localStorage.getItem('oa_id')+
      '&username='+this.form.username+'&phone='+this.form.phone+'&lv='+this.form.lv
      window.location.href = url
    }
  }
};
</script>
<style>



</style>